<template>
    <div class="app-container">
        <!-- 角色分配 -->
        <el-form ref="form" :inline="true" label-width="120px">
            <el-form-item>
                <el-checkbox-group v-model="selected">
                    <el-checkbox v-for="(item,index) in roleData" @change="onChange" :label="item.roleCode"
                                 :value="item.roleCode" :key="item.id" name="type" class="favour_checkbox">
                        {{item.roleName}}
                    </el-checkbox>
                </el-checkbox-group>
            </el-form-item>
        </el-form>
        <div class="dialog-footer" style="float:right">
            <el-button :loading="buttonLoading" type="primary" @click="submitForm('submit')">保 存</el-button>
            <el-button @click="cancel">取 消</el-button>
        </div>
    </div>
</template>

<script>
    import { changeRoleArray } from '@/api/platform/role'
    export default {
        name: "roleForm",
        props: {
            // 角色列表信息
            roleData: Array,
            // 账号已有角色
            nowrole: Array,
            // 账号
            userCode: String,
        },
        data() {
            return {
                // 按钮loading
                buttonLoading: false,
                selected: [],  //选中的数据
            }
        },
        created() {
            // console.log("userCode："+this.userCode);
            const val = []
            this.nowrole.forEach(e => {
                val.push(e.roleCode)
            })
            // console.log("已有角色："+JSON.stringify(val));
            this.selected = val;
        },
        methods: {
            // 选中数据
            onChange(e) {
                // console.log(e)
                // console.log('radio checked', e.target.value)
                console.log("选中数据："+JSON.stringify(this.selected));
            },

            /** 提交按钮 */
            submitForm(flag) {
                if (this.selected.length > 0) {
                    const data = {
                        roleCode: this.selected,
                        userCode: this.userCode
                    }
                    // console.log(data)
                    changeRoleArray(data).then(res => {
                        if (res.retCode === '200') {
                            this.$message.success('修改成功！')
                            //刷新数据
                            this.$emit('submitForm')
                            // 关闭弹窗
                            this.$emit('cancelDialog')
                        } else {
                            this.$message.error('修改失败！  错误号：' + res.retCode)
                            console.log(res)
                        }
                    })
                } else {
                    this.$message.warning("未选择角色！");
                }
            },



            // 取消按钮
            cancel() {
                // 清空
                this.$emit("cancelDialog");
            },
        }

    }

</script>
